<template>
  <div class="userInformation">
    <!--  顶部导航  -->
    <HeaderSimple
      page="userInformation"
      :title="title"
      @goBack="$router.go(-1)"
    ></HeaderSimple>

    <div class="section">
      <div class="user_image">
        <span class="txt">头像</span>
        <van-image class="img" round :src="userImage" />
      </div>

      <div class="user_base">
        <van-cell
          class="user_base_item"
          title="手机号码"
          value-class="dataInfo"
          :value="userPhone"
          is-link
        />
        <van-cell
          class="user_base_item"
          title="姓名"
          value-class="dataInfo"
          :value="userName"
          is-link
        />
        <van-cell
          class="user_base_item"
          title="身份证号"
          value-class="dataInfo"
          :value="userIdNumber"
          is-link
        />
      </div>

      <div class="user_base">
        <van-cell
          class="user_base_item"
          title="银行卡"
          value-class="dataInfo"
          :value="userIdCard"
          is-link
        />
        <van-cell
          class="user_base_item"
          title="开户行"
          value-class="dataInfo"
          :value="userBank"
          is-link
        />
      </div>

      <div class="user_base">
        <van-cell
          class="user_base_item"
          title="卖家退货地址"
          value-class="dataInfo"
          is-link
        />
        <van-cell
          class="user_base_item"
          title="买家收货地址"
          value-class="dataInfo"
          is-link
        />
      </div>

      <div class="user_base">
        <van-cell
          class="user_base_item"
          title="电子合同"
          value-class="dataInfo"
          is-link
        />
      </div>
    </div>
  </div>
</template>

<script>
import HeaderSimple from "@/components/HeaderSimple";
export default {
  name: "userInformation",
  components: {
    HeaderSimple
  },
  data() {
    return {
      title: "", // 顶部导航标题
      userImage: "https://img.yzcdn.cn/vant/cat.jpeg",
      userPhone: "17361715461",
      userName: "王灵凤",
      userIdNumber: "162721637141546141",
      userIdCard: "162721637141546141",
      userBank: "中国建设银行"
    };
  },
  created() {
    this.title = this.$route.meta.title;
  },
  methods: {}
};
</script>

<style scoped lang="less">
@deep: ~">>>";
.userInformation {
  .section {
    width: 100%;
    .user_image {
      margin-top: 30px;
      padding: 25px 30px;
      width: 100%;
      height: 148px;
      background: rgba(255, 255, 255, 1);
      .txt {
        float: left;
        width: 100px;
        height: 98px;
        line-height: 98px;
        font-size: 32px;
        font-family: SourceHanSansCN;
        font-weight: 500;
        color: rgba(51, 51, 51, 1);
      }
      .img {
        float: right;
        width: 98px;
        height: 98px;
        background: rgba(193, 193, 193, 1);
        border-radius: 50%;
      }
    }
    .user_base {
      margin-top: 30px;
      .user_base_item {
        width: 100%;
        height: 98px;
        /*padding: 34px 31px;*/
        font-size: 32px;
        font-family: SourceHanSansCN;
        font-weight: 500;
        color: rgba(51, 51, 51, 1);
        /*border-bottom: 1px solid rgba(193,193,193,1);*/
        .dataInfo {
          font-size: 14px;
          font-family: SourceHanSansCN;
          font-weight: 400;
          color: rgba(193, 193, 193, 1);
        }
      }
      .user_base_item:after {
        border-bottom: 2px solid #ebedf0;
      }
    }
  }
}
</style>
